<header class="mdl-layout__header mdl-layout__header--waterfall site-header">
      <!-- logo -->
      <div class="mdl-layout__header-row site-logo-row nav-bg">
        <span class="mdl-layout__title">
          <div class="site-logo"></div><span class="site-description myfont2" id="geyan">be my hero</span>
        </span>
      </div>
      <div id="liuxing"></div>
      <!-- PC端菜单 -->
      <div class="mdl-layout__header-row site-navigation-row mdl-layout--large-screen-only"
        style="background-image:linear-gradient(-225deg, #2CD8D5 0%, #6B8DD6 48%, #452561e6 100%);">

        <nav class="mdl-navigation mdl-typography--body-1-force-preferred-font myfont">
          <a class="mdl-navigation__link dy" href="/index.html">Home</a>
          <a class="mdl-navigation__link dy" href="/recommend.html">Recommend</a>
          <!-- 搜索 -->
          <form action="/">
            <div class="mdl-textfield mdl-js-textfield mdl-textfield--expandable">
              <label class="mdl-button mdl-js-button mdl-button--icon" for="title">
                <i class="material-icons">search</i>
              </label>
              <div class="mdl-textfield__expandable-holder">
                <input class="mdl-textfield__input" type="text" id="title" name="title">
                <label class="mdl-textfield__label" for="sample-expandable">Expandable Input</label>
              </div>
            </div>
          </form>
          <a class="mdl-navigation__link dy" href="/about.html">About</a>
          <a class="mdl-navigation__link dy" href="/link.html">Link</a>
        </nav>
      </div>
</header>

    <!-- M端菜单 -->
    <div class="mdl-layout__drawer mdl-layout--small-screen-only">
      <nav class="mdl-navigation mdl-typography--body-1-force-preferred-font myfont">
        <a class="mdl-navigation__link" href="/index.html">回到首页</a>
        <a class="mdl-navigation__link" href="/recommend.html">推荐文章</a>
        <a class="mdl-navigation__link" href="/about.html">关于自己</a>
        <a class="mdl-navigation__link" href="link.html">友情链接</a>
      </nav>
    </div>